<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title>Tasks Manager: Manage Your Tasks</title>
<style>

div {
	float: left;
	width: 200px;
	height: 100px;
	border: 1px solid #000;
	margin: 5px;
	text-align: center;
	font: normal 24px/100px Consolas, arial;
	color: blue;
}

#div1 {
	background-image: -moz-linear-gradient(left, white, black);
}

#div2 {
	background-image: -moz-linear-gradient(right, white, black);
}

#div3 {
	background-image: -moz-linear-gradient(50% 100%, white, black);
}

#div4 {
	background-image: -moz-linear-gradient(0% 100%, white, black);
}

#div5 {
	background-image: -moz-linear-gradient(225deg, white, black);
}

#div6 {
	background-image: -moz-radial-gradient(circle farthest-side, black, white);
}

#div7 {
	background-image: -moz-radial-gradient(left, circle farthest-side, black, white);
}

#div8 {
	background-image: -moz-radial-gradient(right top, circle farthest-corner, white, black);
}

#div9 {
	background-image: -moz-radial-gradient(80% 50%, circle closest-side, white, black);
}

</style>
</head>
<body>

<div id="div1">1</div>
<div id="div2">2</div>
<div id="div3">3</div>
<div id="div4">4</div>
<div id="div5">5</div>

<div id="div6">6</div>
<div id="div7">7</div>
<div id="div6">8</div>
<div id="div7">9</div>

</body>
</html>